<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://xmlns.jcp.org/jsf/html"
      xmlns:f="http://xmlns.jcp.org/jsf/core"
      xmlns:ui="http://xmlns.jcp.org/jsf/facelets"
      xmlns:p="http://primefaces.org/ui"
      xmlns:composites="http://xmlns.jcp.org/jsf/composite/composites">
    <h:head>
        <title>Administration</title>
    </h:head>
    <h:body>

        <f:view contracts="main">
            <ui:composition template="/template.xhtml">

                <ui:define name="content">
                    <h:form prependId="false" id="form">
                        <p:growl id="messages" showDetail="true" /> 
                        <h:panelGroup rendered="#{login.current.department.name eq 'Admin'}">
                            <p:accordionPanel id="settings" multiple="true">
                                <p:tab id="departments" title="Departments Management" titletip="Contains options for managing departments" >
                                    <p:tabView effect="fold" id="departmentsView">
                                        <p:tab title="Departments">
                                            <p:panelGrid columns="2" columnClasses="odd,even">
                                                <f:facet name="header">Users Operations</f:facet>
                                                <p:outputLabel for="cretedept" value="New Department"/>
                                                <p:commandButton id="cretedept" icon="ui-icon-contact" oncomplete="PF('newDept').show();" value="create new"></p:commandButton>
                                                <p:dataTable widgetVar="deptsTable" id="deptsTable" var="dept" value="#{departmentsController.allUsersDeparts}" 
                                                             paginator="true" rows="100" 
                                                             paginatorTemplate="{CurrentPageReport}  {FirstPageLink} {PreviousPageLink} {PageLinks} {NextPageLink} {LastPageLink} {RowsPerPageDropdown}" 
                                                             rowsPerPageTemplate="3,25,50,100,250,500"

                                                             >
                                                    <p:column  headerText="Department Name" >
                                                        #{dept.name}

                                                    </p:column>
                                                    <p:column  headerText="Department Description" >
                                                        #{dept.desc}

                                                    </p:column>
                                                    <p:column  headerText="Department Read Access" >
                                                        <p:selectOneMenu converter="deptConveter">
                                                            <f:selectItems value="#{dept.readAccess}" var="read" itemLabel="#{read.name}" itemValue="#{read.id}">

                                                            </f:selectItems>
                                                        </p:selectOneMenu>

                                                    </p:column>
                                                    <p:column  headerText="Department Write Access" >
                                                        <p:selectOneMenu converter="deptConveter">
                                                            <f:selectItems value="#{dept.writeAccess}" var="write" itemLabel="#{write.name}" itemValue="#{write.id}">

                                                            </f:selectItems>
                                                        </p:selectOneMenu>

                                                    </p:column>
                                                    <p:column    headerText="Details"  rendered="#{dept.name ne 'Admin'}">

                                                        <p:commandLink update="deptsTable,:form:editViewer" id="edit" type="button" oncomplete="PF('editDept').show()"  title="Edit Department" immediate="true">   
                                                            <h:outputText styleClass="ui-icon ui-icon-search" style="margin:0 auto;" />  

                                                            <f:setPropertyActionListener value="#{dept}"   
                                                                                         target="#{departmentsController.selected}" />  
                                                        </p:commandLink>  
                                                        <p:fragment>
                                                        <p:commandButton process="@(#deptsTable)" icon="ui-icon-trash" id="delete" action="#{departmentsController.deleteDepartment}"  title="Delete" update="deptsTable,:form:editViewer">   

                                                            <f:setPropertyActionListener value="#{dept}"   
                                                                                         target="#{departmentsController.selected}" /> 
                                                        </p:commandButton> 
                                                            </p:fragment>
                                                    </p:column> 
                                                </p:dataTable>
                                            </p:panelGrid> 
                                        </p:tab>
                                        <p:tab title="Sections" id="sections">
                                            <p:fragment>
                                                <p:commandButton id="cretesection" icon="ui-icon-contact" oncomplete="PF('newSection').show(); " value="New Department"></p:commandButton> 
                                                <p:commandButton id="deletesection" icon="ui-icon-trash" action="#{departmentsController.deleteSection()}" update="sections" value="delete section"></p:commandButton> 
                                            </p:fragment>
                                            <p:tree animate="true" id="sectionsTree" value="#{departmentsController.sectionsTree()}" cache="false"  var="resTree" widgetVar="myTree" selectionMode="single" orientation="horizontal">
                                                <p:ajax event="select" listener="#{departmentsController.onNodeSelect}" update=":form:messages"/>
                                                <p:treeNode icon="ui-icon-image" >
                                                    <h:outputText value="#{resTree}"/>
                                                </p:treeNode>

                                            </p:tree>
                                        </p:tab>
                                        <p:tab title="permissions">
                                            permissions content  
                                        </p:tab>
                                    </p:tabView>
                                </p:tab>
                                <p:tab id="userManagement" title="User Management">
                                    <p:panelGrid columns="2" columnClasses="odd,even">
                                        <f:facet name="header">Users Operations</f:facet>

                                        <p:commandButton onclick="PF('registerDiag').show()" value="Create User"/>
                                    </p:panelGrid>
                                </p:tab>
                                <p:tab title="Restore Operations">
                                    <h:panelGroup id="restoreTab">
                                    <p:outputLabel for="masterPassword" value="New Password" />
                                    <p:password id="masterPassword" value="#{restoreController.newPassword}" required="true" requiredMessage="the new password value is required"/>
                                    <p:commandButton value="change" process="restoreTab" actionListener="#{restoreController.changePassword()}" update="@(#messages)"/>
                                    </h:panelGroup>
                                </p:tab>
                            </p:accordionPanel>
                        </h:panelGroup>
                        <p:dialog header="New Department" widgetVar="newDept">
                            <p:fragment autoUpdate="true">
                                <p:panelGrid columns="2" >
                                    <f:facet name="header">New Department Data</f:facet>
                                    <p:outputLabel value="Name" for="deptName"/>
                                    <p:inputText id="deptName" required="true" requiredMessage="Department name can't be empty" value="#{departmentsController.departName}"/>
                                    <p:outputLabel value="desc" for="desc"/>
                                    <p:inputTextarea id="desc"  value="#{departmentsController.departDesc}"/>
                                    <p:outputLabel value="readAccess" for="readAccess"/>
                                    <p:selectManyMenu value="#{departmentsController.readSet}" converter="deptConveter" id="readAccess" style="height: 150px; width: 270px; overflow: auto">
                                        <f:selectItems  var="dept" value="#{departmentsController.allUsersDeparts}"  itemLabel="#{dept.name}" itemValue="#{dept}"/>
                                    </p:selectManyMenu>
                                    <p:outputLabel value="writeAccess" for="writeAccess"/>
                                    <p:selectManyMenu value="#{departmentsController.writeSet}" converter="deptConveter" id="writeAccess" style="height: 150px; width: 270px; overflow: auto">
                                        <f:selectItems  var="dept" value="#{departmentsController.allUsersDeparts}"  itemLabel="#{dept.name}" itemValue="#{dept}"/>
                                    </p:selectManyMenu>

                                    <f:facet name="footer">

                                        <p:commandButton update="form" value="Create" action="#{departmentsController.saveDept()}" icon="ui-icon-arrowreturnthick-1-w" oncomplete="PF('newDept').hide()"/>
                                    </f:facet>
                                </p:panelGrid>
                            </p:fragment>
                        </p:dialog>
                        <p:dialog header="Edit Department" widgetVar="editDept" dynamic="true" id="editViewer" >
                            <p:fragment autoUpdate="true">
                                <p:panelGrid columns="2" >

                                    <f:facet name="header">Edit Department Data</f:facet>
                                    <p:outputLabel value="Name" for="editName"/>
                                    <p:inputText id="editName" required="true" requiredMessage="Department name can't be empty" value="#{departmentsController.selected.name}"/>
                                    <p:outputLabel value="desc" for="editdesc"/>
                                    <p:inputTextarea id="editdesc"  value="#{departmentsController.selected.desc}"/>
                                    <p:outputLabel value="readAccess" for="editreadAccess"/>
                                    <p:selectManyMenu value="#{departmentsController.selected.readAccess}" converter="deptConveter" id="editreadAccess" style="height: 150px; width: 270px; overflow: auto">
                                        <f:selectItems  var="dept" value="#{departmentsController.allUsersDeparts}"  itemLabel="#{dept.name}" itemValue="#{dept}"/>
                                    </p:selectManyMenu>
                                    <p:outputLabel value="writeAccess" for="editwriteAccess"/>
                                    <p:selectManyMenu value="#{departmentsController.selected.writeAccess}" converter="deptConveter" id="editwriteAccess" style="height: 150px; width: 270px; overflow: auto">
                                        <f:selectItems  var="dept" value="#{departmentsController.allUsersDeparts}"  itemLabel="#{dept.name}" itemValue="#{dept}"/>
                                    </p:selectManyMenu>

                                    <f:facet name="footer">

                                        <p:commandButton update="form" value="Update" action="#{departmentsController.saveDeptChanges()}" icon="ui-icon-arrowreturnthick-1-w" oncomplete="PF('editDept').hide()"/>
                                    </f:facet>

                                </p:panelGrid>
                            </p:fragment>
                        </p:dialog>
                        <p:dialog header="New Section" widgetVar="newSection">
                            <p:fragment autoUpdate="true" >
                                <p:panelGrid columns="2" >

                                    <f:facet name="header">New Department Data</f:facet>
                                    <p:outputLabel value="Name" for="sectionName"/>
                                    <p:inputText id="sectionName" required="true" requiredMessage="Section name can't be empty" value="#{departmentsController.departName}"/>
                                    <p:outputLabel value="desc" for="sectiondesc"/>
                                    <p:inputTextarea id="sectiondesc"  value="#{departmentsController.departDesc}"/>
                                    <p:outputLabel value="Parent department" for="parent" />
                                    <p:fragment>
                                        <p:scrollPanel >
                                            <p:tree animate="true" id="parent" value="#{departmentsController.sectionsTree()}" cache="false"  var="resTree" widgetVar="myTree2" selectionMode="single" style="height: 200px; width: 320px; overflow: auto">
                                                <p:ajax event="select" listener="#{departmentsController.onNodeSelect}" update=":form:messages" process="@(#parent)"/>
                                                <p:treeNode icon="ui-icon-image" >
                                                    <h:outputText value="#{resTree}"/>
                                                </p:treeNode>

                                            </p:tree>
                                        </p:scrollPanel>
                                    </p:fragment>


                                    <f:facet name="footer">

                                        <p:commandButton update="@(#sections)" value="Create" action="#{departmentsController.saveSection()}" icon="ui-icon-arrowreturnthick-1-w" oncomplete="PF('newSection').hide()"/>
                                    </f:facet>

                                </p:panelGrid>
                            </p:fragment>
                        </p:dialog>
                        <h:panelGroup rendered="#{login.current.department.name ne 'Admin'}">
                            Get out of here
                        </h:panelGroup>
                    </h:form>
                    <p:dialog dynamic="true" header="Create User" hideEffect="fade" modal="true" widgetVar="registerDiag" id="diag">
                        <h:form id="registerform">

                            <composites:register regName="#{registerBean.userName}" regPass="#{registerBean.password}" 
                                                 selectedRole="#{registerBean.role}" roles="#{registerBean.roles}"
                                                 registerAction="#{registerBean.register}" registerUpdate="registerform" registerComplete="handleLoginRequest(xhr, status, args)"/>
                        </h:form>
                        <script type="text/javascript">
                            function handleLoginRequest(xhr, status, args) {
                                if (args.validationFailed || !args.successful) {
                                    PF('registerDiag').jq.effect("shake", {times: 5}, 100);
                                }
                                else {
                                    PF('registerDiag').hide();

                                }
                            }
                        </script>
                    </p:dialog>

                </ui:define>
                <ui:define name="left">
                    left
                </ui:define>
            </ui:composition>
        </f:view>
    </h:body>
</html>

